<template>
	<view>
		<van-nav-bar title="质量整改" placeholder fixed left-arrow @click-left="onClickLeft"></van-nav-bar>
		<view class="msg">
			<van-space direction="vertical" fill :size='15' class="container">
				<view>整改编号<text>{{msgList[0]?.rectificationCode}}</text></view>
				<view>检查部位<text>{{msgList[0]?.qualityPart}}</text></view>
				<view>检查单位<text>{{msgList[0]?.qualityUnitsName}}</text></view>
				<view>检查人员<text>{{msgList[0]?.qualityMemberId}}</text></view>
				<view>问题描述<text>{{msgList[0]?.problemDescription}}</text></view>
				<view>整改意见<text>{{msgList[0]?.suggestion}}</text></view>
				<view>整改时限<text>{{msgList[0]?.deadline}}</text></view>
				<view>通知时间<text>{{msgList[0]?.rectificationTime}}</text></view>
				<view>相关附件<text>{{msgList[0]?.qualityRectificationFileList[0]?.fileTitle}}</text></view>

				<van-space direction="vertical" fill :size='15' v-if="Status === '待复查'">
					<van-divider :style="{ color: '#bfbfbf', borderColor: '#bfbfbf'}">处理情况</van-divider>
					<view>处理人员<text>{{msgList[0]?.dealMemberId}}</text></view>
					<view>处理时间<text>{{msgList[0]?.dealTime}}</text></view>
					<view>处理情况<text>{{msgList[0]?.dealDescription}}</text></view>
				</van-space>


				<!-- 监理进行审批 -->
				<van-form v-if="approvalRole==='true' && Status === '待复查'" @submit="onSubmit">
					<van-cell-group>
						<van-divider :style="{ color: '#bfbfbf', borderColor: '#bfbfbf'}">复查情况</van-divider>
						<zxz-uni-data-select v-model="MemberSelect" @change='MemberChange' label='复查人员'
							dataValue='value' multiple :localdata='columns'></zxz-uni-data-select>
						<van-field :label-width='80'  required name="isPass" label="复查结果">
							<template #input>
								<van-radio-group v-model="checked" direction="horizontal">
									<van-radio name="1">通过</van-radio>
									<van-radio name="0">不通过</van-radio>
								</van-radio-group>
							</template>
						</van-field>
						<van-field required name="resultDescription" v-model="message" label="复查情况" type="textarea"
							placeholder="请输入" />
						<van-field required v-model="resultTime" is-link readonly name="resultTime" label="通知时间"
							placeholder="请选择" @click="showPicker = true"
							:rules="[{ required: true, message: '请选择通知时间' }]" />
						<van-popup v-model:show="showPicker" position="bottom">
							<van-picker-group title="通知时间" :tabs="['选择日期', '选择时间']" @confirm="onConfirm"
								@cancel="showPicker = false">
								<van-date-picker v-model="currentDate" :min-date="new Date(2020, 0, 1)"
									:max-date="new Date(2025, 5, 1)" />
								<van-time-picker v-model="currentTime" />
							</van-picker-group>
						</van-popup>
						<van-button block type="primary" native-type="submit">提交</van-button>
					</van-cell-group>
				</van-form>

				
				<!-- 复查 -->
				<van-space direction="vertical" fill :size='15' v-if="Status === '复查通过' || Status === '复查不通过'">
					<van-divider :style="{ color: '#bfbfbf', borderColor: '#bfbfbf'}">复查情况</van-divider>
					<view>处理人员<text>{{qualityRectificationMsg[0]?.dealMemberId}}</text></view>
					<view>处理时间<text>{{qualityRectificationMsg[0]?.dealTime}}</text></view>
					<view>处理情况<text>{{qualityRectificationMsg[0]?.dealDescription}}</text></view>
					<view>复查时间<text>{{qualityRectificationMsg[0]?.resultTime}}</text></view>
					<view>复查情况<text>{{qualityRectificationMsg[0]?.resultDescription}}</text></view>
					<view>复查结果<text style="color: red;">{{qualityRectificationMsg[0]?.isPass}}</text></view>
				</van-space>

				<!-- 施工人员处理整改 -->
				<van-form v-if="(approvalRole==='false' && Status==='复查不通过' && activeIndex==0) || (approvalRole==='false' && Status === '整改中')" @submit="onSubmitForm">
					<van-divider
						:style="{ color: '#bfbfbf', borderColor: '#bfbfbf'}">整改处理</van-divider>
					<zxz-uni-data-select v-model="MemberSelect" @change='MemberChange' label='处理人员' dataValue='value'
						multiple :localdata='columns'></zxz-uni-data-select>
				
					<van-field required is-link readonly name="dealTime" v-model="dealTime" label="处理时间"
						placeholder="请选择" @click='show=true' />
					<van-popup v-model:show="show" position="bottom">
						<van-picker-group title="通知时间" :tabs="['选择日期', '选择时间']" @confirm="onConfirmDate"
							@cancel="show = false">
							<van-date-picker v-model="currentDate" :min-date="new Date(2020, 0, 1)"
								:max-date="new Date(2025, 5, 1)" />
							<van-time-picker v-model="currentTime" />
						</van-picker-group>
					</van-popup>
				
					<van-field required name="dealDescription" v-model="dealDescription" label="处理情况" type="textarea"
						placeholder="请输入" />
					<van-button block type="primary" native-type="submit">提交处理</van-button>
				</van-form>
				

			</van-space>
		</view>
	</view>
</template>

<script setup lang='ts'>
	import dayjs from 'dayjs';
	import {
		showSuccessToast,
		showFailToast
	} from 'vant';
	import {
		onMounted,
		reactive,
		ref
	} from 'vue';
	import {
		onLoad
	} from '@dcloudio/uni-app'
	import {
		getQualityRectificationProcessById,
		qualityRectificationReview,
		projectUserManageList,
		qualityRectificationDispose,
		selectQualityRectificationById
	} from '@/apis/qualityRectification.js'
	const checked = ref('1');
	const message = ref('')
	let msgList = reactive([])
	const qualityRectificationId = ref(0)
	const approvalRole = ref(false)
	const Status = ref('')
	const show = ref(false)
	const MemberSelect = ref([])
	const columns = ref([])
	const dealTime = ref('')
	const dealDescription = ref('')
	const currentDate = ref([])
	const currentTime = ref([])
	const projectId = uni.getStorageSync('projectInfo').id
	const unitsId = uni.getStorageSync('SelfUserInfo').unitsId
	const showPicker = ref(false)
	const resultTime = ref('')
	const qualityRectificationMsg = ref([])
	const activeIndex=ref(0)
	
	onMounted(() => {
		getCurrentDateArray()
		getList()
	})

	const getList = () => {
		projectUserManageList(projectId, unitsId).then(res => {
			columns.value = res.data.map(e => ({
				text: e.userName,
				value: e.userId
			}))
		})
		getQualityRectificationProcessById(qualityRectificationId.value).then(res => {
			qualityRectificationMsg.value.push(res.data)
		})
		selectQualityRectificationById(qualityRectificationId.value).then(res => {
			console.log(res.data);
			// qualityRectificationInfo
		})
	}

	//日期选择
	const onConfirm = (arr) => {
		resultTime.value = arr[0].selectedOptions.reduce((a, c) => a === '' ? a + c.text : a + '-' + c.text, '') +
			' ' + arr[1].selectedOptions.reduce((a, c) => a === '' ? a + c.text : a + ':' + c.text, '')
		showPicker.value = false
	}

	//人员选择
	const MemberChange = () => {
		console.log(MemberSelect.value);
	}

	//获取当前日期
	const getCurrentDateArray = () => {
		const today = dayjs();
		const year = today.format('YYYY');
		const month = today.format('MM');
		const day = today.format('DD');
		const hour = today.format('HH');
		const minute = today.format('mm');
		currentDate.value = [year, month, day];
		currentTime.value = [hour, minute]
	};

	//日期选择
	const onConfirmDate = (arr) => {
		dealTime.value = arr[0].selectedOptions.reduce((a, c) => a === '' ? a + c.text : a + '-' + c.text, '') + ' ' +
			arr[1].selectedOptions.reduce((a, c) => a === '' ? a + c.text : a + ':' + c.text, '')
		show.value = false
	}

	//施工单位提交处理
	const onSubmitForm = (value) => {
		if (MemberSelect.value.length === 0) {
			showFailToast('请选择检查人员')
		} else {
			let requestMsg = value
			requestMsg.dealMemberIdList = MemberSelect.value
			requestMsg.id = +qualityRectificationId.value
			requestMsg.dealUnitsId = unitsId
			requestMsg.dealTime = dealTime.value.replace(" ", "T") + ":00Z"
			qualityRectificationDispose(requestMsg).then(res => {
				if (res.code === 200) {
					showSuccessToast('提交成功')
					uni.navigateBack()
				}
			})
		}
	}

	//监理复查
	const onSubmit = (values) => {
		console.log(values.isPass);
		if (values.isPass == 1 || values.isPass == 0 && values.resultDescription.trim() != '') {
			let request = {
				id: +qualityRectificationId.value,
				isPass: +values.isPass,
				resultDescription: values.resultDescription,
				resultsMemberIds: MemberSelect.value,
				resultTime: resultTime.value.replace(" ", "T") + ":00Z",
			}
			qualityRectificationReview(request).then(res => {
				if (res.code === 200) {
					showSuccessToast('复查成功');
					uni.navigateBack()
				}
			})
		} else {
			showFailToast('不通过请输入审批意见')
		}
	}

	const onClickLeft = () => {
		uni.navigateBack()
	}
	
	

	onLoad(({id,flowStatus,approval,active}) => {
		qualityRectificationId.value = id
		Status.value = flowStatus
		approvalRole.value = approval
		activeIndex.value=active
		selectQualityRectificationById(id).then(res => {
			msgList.push(res.data);
		})
	})
</script>

<style scoped lang="scss">
	.msg {
		height: 100%;
		padding: 10px;

		.container {
			background-color: white;
			padding: 20rpx;
			color: #666;

			.btn {
				display: flex;
				justify-content: space-between;

				.btns {
					width: 48%;
				}
			}
		}

		text {
			margin-left: 20px;
		}
	}
</style>